import React,{Component} from 'react'
import PropTypes from 'prop-types'
import { Table,Pagination,Modal  } from 'antd'
import './index.scss'
// 搜索组件
import Search from "./search";
class TableComponent extends Component{
    constructor(props) {
        super(props);
        this.state = {
            ...props.tabConfig,
            pageData:{
                pageNumber: 1,
                pageSize: 10
            },
            visible:false,
            data:[],
            tableLoading: false,
            rowSelection: { // 多选
                onChange: (selectedRowKeys) => {
                    this.setState({selectedRowKeys});
                },
            }
        }
    }
    static propTypes = {
        tabConfig: PropTypes.object
    }
    handleSearch = (e)=>{
        const data = Object.assign(this.state.listForm,e)
        this.setState({
            ...this.state,
            listForm:data
        })
        this.getList()
    }
    // 组件初始化
    componentDidMount() {
        this.getList()
    }
    getList = ()=>{
        this.setState({
            ...this.state,
            tableLoading: true
        })
        const { getList,listForm,pageData } = this.state
        getList && getList(Object.assign(listForm,pageData)).then(e=>{
            const {data, total} = e.data
            this.setState({
                ...this.state,
                tableLoading: false,
                data
            })
        })
    }
    // 对话框 确定
    handleOk = ()=>{
        this.setState({
            ...this.state,
            confirmLoading:true
        })
        /*departmentDelete({
            id:this.state.delId
        }).then(e=>{
            this.setState({
                ...this.state,
                confirmLoading:false,
                visible:false
            },()=>{
                this.getList()
            })
        })*/
    }
    // 对话框取消
    handleCancel = ()=>{
        this.setState({
            ...this.state,
            visible:false
        })
    }
    handleShowModal = ()=>{
        this.setState({
            visible:true
        })
    }
    render() {
        const { columns,pagination,rowKey,data, tableLoading,rowSelection,searchList,footer } = this.state
        return(
            <div>
                <div style={{
                    marginBottom:'20px'
                }}>
                    <Search search={this.handleSearch} list={searchList || []} />
                </div>
                <Table footer={()=>(
                    <footer className={'footer'}>
                        <div>{footer()}</div>
                        <Pagination
                            {
                                ...pagination
                            }
                        />
                    </footer>
                )} rowSelection={rowSelection} dataSource={data} pagination={false} loading={tableLoading} columns={columns}  rowKey={rowKey || 'id'} bordered />
                <Modal
                    title="提示"
                    visible={this.state.visible}
                    onOk={this.handleOk}
                    confirmLoading={this.state.confirmLoading}
                    onCancel={this.handleCancel}
                >
                    <div>
                        是否删除？
                    </div>
                </Modal>
            </div>
        )
    }
}
export default TableComponent
